Importing Adobe Photoshop files with layers

You can import Photoshop images (.psd) with layers to Kanzi Studio and preserve the structure of the .psd file. This allows you to use each layer in a .psd file as a separate image.

When you import a .psd file with layers Kanzi Studio:

  1. Crops the transparent borders from each layer and saves .png images to Library > Resource Files > Images in a directory with the same name as the .psd file.
  2. Creates an Empty Node 2D named after the .psd file and a hierarchy of Empty Node 2D objects corresponding to the structure of the .psd image. Image objects are used for .psd layer images and Empty Node 2D objects for the .psd layers groups.
  3. Applies transformation to each Image and Empty Node 2D to place it to the same location as in the .psd file.

For example, when you import a .psd file that contains one layer for the background and another layer that contains a small logo in the corner of the screen, Kanzi Studio creates two .png images in your Kanzi Studio project and two Image objects you can use as 2D components in your Kanzi application. The trashbands are removed from the small logo, meaning that you end up with two images of different sizes. The image layer containing the small logo is placed as a child of the background layer and correctly positioned in relation to its parent.

Note that Kanzi Studio does not support all types of Photoshop layers and layer styles. If Kanzi Studio does not import a layer or layer style, merge or rasterize layers in Photoshop before importing them to Kanzi Studio.

Note that to maintain pixel precision, use integers for all Kanzi Studio 2D layer transformations and avoid stretching or scaling the content.

Importing layers from a .psd file

To import layers from a .psd file:

  1. In the Assets click Import Assets.
  2. Select the .psd file you want to import.
    Import PSD tool window opens.
  3. In the Select the layers to import all layers and groups are selected by default. Click the layer or group name to either include or exclude it from the import.
  4. (Optional) If your .psd file contains text layers, you can import them as Kanzi Text Block 2D objects so that you can edit the text in Kanzi Studio. In the Import text layers as option select:

    You can set a default value for this option in the Edit > User Preferences > Advanced tab > Import text layers as option.

  5. Click Import.
    Kanzi Studio imports the layers you selected and preserves the layer hierarchy from the .psd file. The order in which Kanzi Studio renders layers is set by their order in the Project: a child layer appears on top of the parent layer.

See also

Importing images

Using the Image node

Textures